<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>红岩网校临时作业提交平台</title>
</head>
<body>
    @yield('content')
</body>
<h3>红岩网校临时作业提交平台(也就是后面会有个大的。。 = =)</h3>
<script type="text/template" action="/upload" id="form_template">
    <section>
        <label for="username">姓名：</label>
        <input type="text" id="username" name="std_username" required/>
    </section>
    <section>
        <label for="number">学号：</label>
        <input type="number" id="number" name="std_number" required/>
    </section>
    <section>
        <label for="department">部门：</label>
        <select name="std_department" id="department">
            <option value="1">Web研发部</option>
            <option value="2">移动开发部</option>
        </select>
    </section>
    <section>
        <label for="phone">手机：</label>
        <input type="number" id="phone" name="std_phone" required/>
    </section>

    <section>
        <label for="homework">作业：</label>
        <input id="fileupload" type="file" name="std_file" data-url="/upload">
    </section>

</script>


<div class="container">
    <form id="fileupload" action="/upload" method="POST" enctype="multipart/form-data">

    </form>
    <p>Web部上交人数: <span id="webCount"></span></p>
    <p>移动部上交人数：<span id="mobileCount"></span> </p>

    <p>文件限定格式： zip, rar, 7z</p>
</div>
<script src="/dest/domop.min.js"></script>
<script>

var Home_Model = Backbone.Model.extend({
    urlRoot : "/upload",

    initialize : function(){
        this.bind("error", function(error){
            console.log(error);
        });
    }
});

var home_model = new Home_Model();

var Home_view = Backbone.View.extend({
    el : ".container" ,

    template : function(){
        var template = _.template($("#form_template").html())();
        $("form").html(template);
        return this;
    },

    renderCount : function(){
        $.get("/count", function(model){
            var Web_num = model.Web_num,
                Mobile_num = model.Mobile_num;

            $("#webCount").html(Web_num);
            $("#mobileCount").html(Mobile_num);

        });
        return this;
    },


    render : function(){
        var self = this;

        self.template();

        $("#fileupload").fileupload({
            done: function (e, data) {
                console.log(data);
                if(! data.result.success){

                    var str = [],
                        error = data.result.error;
                    for(var key in error){
                        str.push(key + ": " + error[key]);
                    }

                    alert(str.join("; \n"));
                }else{
                    alert("上传成功！");
                }

                self.renderCount();
            }
        });

        self.renderCount();


    },

    events : {
        "submit #fileupload" : "handleSubmit"
    },

    "handleSubmit" : function(e){
        e.preventDefault();

        alert(1);

    }

});

var home_view = new Home_view();
var Router = Backbone.Router.extend({
    routes : {
        "" : "home"
    }
});
var router = new Router();

router.on('route:home', function(){
    home_view.render();
});

Backbone.history.start();

</script>
</html>